<template>
  <div>
    <div class="title">
     <span>{{ title }}</span>
    </div>
    <div class="card">
      <slot></slot>
    </div>

  </div>
</template>
<script setup>
import { ref , defineProps } from "vue" 
const props = defineProps({
  title: {
    type: String,
    default:''
  }
})
</script>

<style scoped lang="css" >
.card{
  width: 85%;
  height: 100%;
  background: #1a2154;
  opacity: 0.8;
  border-radius:20px ;
  margin: 10px 20px;
}
.title::before{
  content: '';
  width: 15px;
  height: 15px;
  background-color: #47F0F6FF;
  display: inline-block;
  transform: rotate(45deg);
  text-align: left;
}
.title  span{
font-family: PangMenZhengDao;
margin-left: 20px;
font-size: 20px;
}
</style>